import { _decorator, Component, Node, Button, Label, Animation, Widget, Layout } from 'cc';
import { BasePanel } from '../../../../scripts/libs/ui/BasePanel';
import { BindButton } from '../../../../scripts/libs/rxjs/cc3/BindButton';
import { ReactiveProperty } from '../../../../scripts/libs/rxjs/cc3/ReactiveProperty';
import { i18n } from '../../../../scripts/i18n';
const { ccclass, property } = _decorator;

@ccclass('DialogPanel')
export class DialogPanel extends BasePanel {

    title = ReactiveProperty.Create(null);
    content = ReactiveProperty.Create(null);
    okBtnText = ReactiveProperty.Create(null);
    cancelBtnText = ReactiveProperty.Create(null);

    @property(Button)
    okButton: Button = null;

    @property(Button)
    cancelButton: Button = null;

    @property(Label)
    contentLabel: Label = null;

    @property(Label)
    titleLabel: Label = null;

    @property(Label)
    okBtnTextLabel: Label = null;

    @property(Label)
    cancelBtnTextLabel: Label = null;

    willBind(): void {
        if (this.title.value == null) this.title.value = i18n.t('lobby.dialogpanel.title');
        if (this.okBtnText.value == null) this.okBtnText.value = i18n.t('lobby.dialogpanel.ok');
        if (this.cancelBtnText.value == null) this.cancelBtnText.value = i18n.t('lobby.dialogpanel.cancel');
        if (this.content.value == null) this.content.value = '';
    }

    useObserves() {
        return [
            BindButton(this.okButton).subscribe(this.okButtonClicked.bind(this)),
            BindButton(this.cancelButton).subscribe(this.cancelButtonClicked.bind(this)),
            this.content.subscribe(content => this.contentLabel.string = content ?? ''),
            this.title.subscribe(title => this.titleLabel.string = title ?? ''),
            this.okBtnText.subscribe(text => this.okBtnTextLabel.string = text ?? ''),
            this.cancelBtnText.subscribe(text => this.cancelBtnTextLabel.string = text ?? ''),
        ];
    }

    okButtonClicked() {
        this.log('okButtonClicked');
        DialogPanel.CloseProcess(null, { result: 'ok' }, null);
    }

    cancelButtonClicked() {
        this.log('cancelButtonClicked');
        DialogPanel.CloseProcess(null, { result: 'cancel' }, null);
    }
}

